<!-- 公司详情 -->
<template>
  <div class="">
    <el-card class="box-card">
      <h3 class="title">公司信息展示</h3>
      <el-table :data="formData" style="width: 100%;margin-top:30px;" border="" stripe>
        <el-table-column label="注册日期">
          <template slot-scope="scope">{{scope.row.createTime|timestampToDate("yyyy-MM-dd")}}</template>
        </el-table-column>
        <el-table-column label="公司名称">
          <template slot-scope="scope">{{scope.row.name}}</template>
        </el-table-column>
        <el-table-column label="公司类型">
          <template slot-scope="scope">{{typeFilter[scope.row.type]}}</template>
        </el-table-column>
        <el-table-column label="公司规模">
          <template slot-scope="scope">{{scaleFilter[scope.row.scale]}}</template>
        </el-table-column>
        <el-table-column align="center" label="操作">
          <template slot-scope="scope">
            <el-button size="mini" @click="editRowEvent(scope.row)">编辑</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-card>
    <el-dialog width="35%" :visible.sync="dialogVisible" title="修改公司信息">
      <el-form :model="userData" label-width="80px" label-position="left">
        <el-form-item label="公司名称">
          <el-input v-model="userData.name"/>
        </el-form-item>
        <el-form-item label="行业类型">
          <el-select style="width:100%" v-model="userData.type" placeholder="行业类型">
            <el-option label="计算机" value="0"></el-option>
            <el-option label="互联网" value="1"></el-option>
            <el-option label="物联网" value="2"></el-option>
            <el-option label="其他" value="3"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="人员规模">
          <el-select style="width:100%" v-model="userData.scale" placeholder="人员规模">
            <el-option label="20人以下" value="0"></el-option>
            <el-option label="20-50人" value="1"></el-option>
            <el-option label="50-100人" value="2"></el-option>
            <el-option label="其他" value="3"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div style="text-align:right;">
        <el-button type="danger" @click="dialogVisible=false">取消</el-button>
        <el-button type="primary" @click="handleSave">确定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
// import { regist } from "@/api/login";
import { information } from "@/api/company";
import { regist, save01 } from "@/api/login";
export default {
  //import引入的组件需要注入到对象中才能使用
  name: "basicBox",
  components: {},
  data() {
    //这里存放数据

    return {
      formData: [],
      typeFilter: ["互联网", "计算机", "物联网", "其他"],
      scaleFilter: ["20-50人", "50以上", "100以上"],
      dialogVisible: false,
      userData: {
        name: "",
        type: "",
        scale: ""
      }
    };
  },
  //监听属性 类似于data概念
  computed: {},
  //监控data中的数据变化
  watch: {},
  //方法集合
  methods: {
    //公司信息
    companyInformation() {
      information().then(response => {
        this.formData = response.body;
        //     console.log(response);
      });
    },
    //
    handleAddUser() {
      this.List.unshift({ temp_edit: true });
    },

    //
    saveRowEvent(row) {
      regist(row).then(response => {
        if ((response.code = 100)) {
          this.fetchData();
        }
      });
    },
    cancelRowEvent(index, row) {
      this.List.splice(index, 1);
    },
    editRowEvent(row) {
      this.dialogVisible = true;
      this.userData = row;
      row.type = String(row.type);
      row.scale = String(row.scale);
    },
    //保存刷新c
    handleSave() {
      save01(this.userData).then(res => {
        if (res.code === 100) {
          this.companyInformation();
          this.dialogVisible = false;
        }
      });
    }
  },
  //生命周期 - 创建完成（可以访问当前this实例）
  created() {
    this.companyInformation();
  },
  //生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {},
  beforeCreate() {
    console.log("beforecreate");
  }, //生命周期 - 创建之前
  beforeMount() {
    console.log("beforeMount");
  }, //生命周期 - 挂载之前
  beforeUpdate() {
    console.log("beforeUpdate");
  }, //生命周期 - 更新之前
  updated() {
    console.log("updated");
  }, //生命周期 - 更新之后
  beforeDestroy() {
    console.log("beforeDestroy");
  }, //生命周期 - 销毁之前
  destroyed() {
    console.log("destroyed");
  }, //生命周期 - 销毁完成
  activated() {
    console.log("activated");
  } //如果页面有keep-alive缓存功能，这个函数会触发
};
</script>
<style lang='scss' scoped>
//@import url(); 引入公共css类
.box-card {
  margin: 20px 10px 10px 10px;
}
</style>